if 分支流程可视化 🌈

if/if-else 分支执行流程演示

1 输入判断条件

当前判断条件:数值 ≥ 60

输入值:80

2 判断条件是否成立

执行判断:80 ≥ 60

判断结果:——

3 执行 if 分支(条件成立时)

if (数值 ≥ 60) {
  console.log("及格了,继续加油!");
}

执行状态:未执行

4 执行 else 分支(条件不成立时)

else {
  console.log("不及格,需要努力!");
}

执行状态:未执行

5 分支流程执行结束

最终执行结果:——

if 分支核心知识点总结

基本语法

// 仅 if 分支
if (条件表达式) {
  // 条件成立时执行的代码块
  语句1;
  语句2;
}

// if-else 分支
if (条件表达式) {
  // 条件成立时执行
  代码块1;
} else {
  // 条件不成立时执行
  代码块2;
}

执行规则

  • 条件表达式的结果只有 true(成立)和 false(不成立)两种
  • 仅 if 分支:条件成立则执行代码块,不成立则跳过,直接执行后续代码
  • if-else 分支:二选一执行,条件成立执行 if 代码块,否则执行 else 代码块
  • 代码块的大括号 {} 若只有一条语句可省略,建议始终保留以提高可读性
  • 条件表达式可使用比较运算符(><=== 等)

常见误区提醒

  • 不要混淆赋值运算符 = 和相等运算符 ===(条件判断中应使用 ===
  • if 后面的条件表达式不需要加分号 ;,加了会导致代码块不受条件控制
  • else 分支不能单独存在,必须紧跟在 if 分支之后

互动小游戏:条件判断闯关

当前关卡:1/10

当前得分:0

请点击「开始游戏」进入第一关

游戏规则

  • 系统会生成一个条件判断语句(如:5 > 3),需要你判断该条件是否成立
  • 点击「成立(true)」或「不成立(false)」提交答案,答对得10分,答错不扣分
  • 共10个关卡,全部完成后显示最终得分
  • 可重复游戏,巩固条件判断的核心逻辑